<template>
  <div class="container">
    <!-- 这是注释 -->
    <h2>{{ str }}</h2>
    <button @click="one">翻转世界</button>
  </div>
</template>

<script>
export default {
  // 这里放vue相关代码
  data() {
    return {
      str: "你好世界",
    };
  },
  methods: {
    one() {
      // console.log(this.str)
      // 翻转字符串
      //将str里你好世界 先通过split变成数组(因为数组才能用翻转的方法)  然后通过reverse方法将数组翻转,翻转成功后再用join('')方法 拼接成字符串
      this.str = this.str.split("").reverse().join("");
    },
  },
};
</script>

<style>
h2 {
  color: red;
}
</style>